<template>
    <view>
		<!-- <topBar text="发布车位" :needBack="true"></topBar> -->
		<view class="head-block" v-if="weixin == 2">
				     <view class="nav-title" :style="'top:10px'"></view>
					 <!-- 返回 -->
					 <view class="icon" @tap="goMy" :style="'top:6px'">
					      <van-icon name="arrow-left" color="#333" size="45rpx" />
					  </view>
				 </view>
        <view class="topBox2" :style="weixin != 2 ? 'top:-30rpx;' : ''">
            <van-dropdown-menu class="topBoxMenu">
                <van-dropdown-item v-model="value1" :options="option1" @change="menuChange" />
            </van-dropdown-menu>
            <image class="billHis" mode="widthFix" src="../../static/assets/img/billHis.png" @tap.stop.prevent="goDetail"></image>
            <text class="goDetail" @tap.stop.prevent="goDetail">开票记录</text>
        </view>

        <view class="memberList">
            <view v-for="(item, index) in list" :key="index">
                <view class="member_box" :data-index="index" :data-name="item.id">
                    <checkbox class="checkbox" :data-index="index" :checked="item.checked" @tap="select" />
                    <view class="billInfo">
                        <view class="applicant_name">订单编号：{{ item.billNo }}</view>
                        <view class="applicant_name">
                            <text style="font-size: 32rpx; color: #292d39; letter-spacing: 0">{{ item.parkingName }}</text>
                            <text v-if="item.parkingSpaceNo">{{ item.parkingSpaceNo }}</text>
                        </view>
                        <view class="applicant_name applicant_name2" v-if="item.startTime">月卡期限：{{ item.startTime }}-{{ item.endTime }}</view>
                        <view class="applicant_name applicant_name2" style="position: relative">
                            <view>车牌号：{{ item.plateNo }}</view>
                            <view class="approval_state">
                                {{ item.actualPay / 100 }}
                                <text style="font-family: SourceHanSansCN-Regular; font-size: 20rpx; color: #757575; letter-spacing: 0">元</text>
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
        <view class="allSelect_box">
            <checkbox class="checkbox" @tap.stop.prevent="selectAll" :checked="selectilall" />
            <view style="" class="infoBill">
                <view
                    class="allSelect"
                    @tap.stop.prevent="selectAll"
                    style="top: -10rpx; font-family: SourceHanSansCN-Normal; font-size: 30rpx; color: #6a6a6a; letter-spacing: 0; text-align: center"
                >
                    本页全选
                </view>
                <view class="allSelect allSelect2" @tap.stop.prevent="selectAll" style="top: 20rpx">
                    已选择
                    <text style="color: #00bcab">{{ num }}</text>
                    个订单，开票金额合计
                    <text style="color: #00bcab">{{ fee }}</text>
                    元
                </view>
            </view>

            <text class="next" @tap.stop.prevent="goNext">下一步</text>
        </view>
    </view>
</template>

<script>
import util from './../../utils/util.js';
import api from './../../utils/api.js';
export default {
    data() {
        return {
            billNo: [],
            value1: 0,
            option1: [
                // { text: '君景庭1', value: 0 },
                // { text: '君景庭2', value: 1 },
                // { text: '君景庭3', value: 2 },
            ],
            num: 0,
            fee: 0,
            list: [
                // { id: 1, name: 1, checked: false ,je:301},
                // { id: 2, name: 2, checked: false ,je:301},
                // { id: 3, name: 3, checked: false ,je:301},
                // { id: 4, name: 4, checked: false ,je:301},
                // { id: 5, name: 5, checked: false ,je:301},
            ],
            selectilall: false,
			weixin:uni.getStorageSync('weixin')
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        this.findInvoiceParkingList();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
        this.findInvoiceParkingList();
        this.setData({
            num: 0,
            fee: 0,
            billNo: [],
            selectilall: false
        });
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    // onShareAppMessage: function () {
    // }
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */ methods: {
		 goMy() {
		 		     uni.navigateBack({
		 		         delta: 1
		 		     });
		 		 },
        //单选
        select: function (e) {
            let selectValue = e.currentTarget.dataset.name;
            let index = e.currentTarget.dataset.index;
            let list = this.list;
            let newli = 'list[' + index + '].checked';
            this.list[index].checked = !this.list[index].checked;
            let num = 0;
            let fee = 0;
            let billNo = [];

            for (var i = 0; i < this.list.length; i++) {
                if (this.list[i].checked) {
                    num++;
                    fee += this.list[i].actualPay;
                    billNo.push(this.list[i].billNo);
                }
            }

            fee = fee / 100;
            this.setData({
                num: num,
                fee: fee,
                billNo: billNo
            });
            if (num == this.list.length) {
                this.setData({
                    selectilall: true
                });
            } else {
                this.setData({
                    selectilall: false
                });
            }
        },

        menuChange(e) {
            this.setData({
                value1: e
            });
            const unionId = uni.getStorageSync('unionId') || '';
            var param = {
                userUnionId: unionId,
                //e5ecc37c-dc0c-450a-ac96-e91c3349408b unionId
                parkingCode: e,
                pageSize: '999',
                pageNo: '1'
            };
            util.request(api.findAllowInvoiceBill, param, 'POST')
                .then((res) => {
                    if (res.success) {
                        this.setData({
                            list: res.data.content
                        });
                        let num = 0;
                        let fee = 0;
                        let billNo = [];
                        this.setData({
                            num: num,
                            fee: fee,
                            billNo: billNo,
                            selectilall: false
                        });
                    } else {
                        uni.showToast({
                            title: res.msg || '提交失败',
                            icon: 'none'
                        });
                    }
                })
                .catch((err) => {
                    uni.showToast({
                        title: '接口出错了...',
                        icon: 'none'
                    });
                });
        },

        goNext() {
            if (this.num == 0) {
                uni.showToast({
                    title: '抱歉，请先选择订单',
                    icon: 'none'
                });
                return;
            }

            if (this.value1 == 0) {
                uni.showToast({
                    title: '抱歉，暂未有合适的车场',
                    icon: 'none'
                });
                return;
            }

            uni.navigateTo({
                url: '../billIndex2/index?fee=' + this.fee + '&billNos=' + this.billNo + '&parkingCode=' + this.value1
            });
        },

        goDetail() {
            uni.navigateTo({
                url: '../billIndexDetail/index'
            });
        },

        //全选，取消全选
        selectAll: function (e) {
            let list = this.list;
            let selectilall = this.selectilall;
            let fee = 0;
            let billNo = [];

            if (selectilall == false) {
                for (let i = 0; i < list.length; i++) {
                    let newli = 'list[' + i + '].checked';
                    fee += list[i].actualPay;
                    billNo.push(list[i].billNo);
                    this.list[i].checked = true;
                    this.setData({
                        selectilall: true
                    });
                }

                fee = fee / 100;
                this.setData({
                    num: list.length,
                    fee: fee,
                    billNo: billNo
                });
            } else {
                for (let i = 0; i < list.length; i++) {
                    let newli = 'list[' + i + '].checked';
                    this.list[i].checked = false;
                    this.setData({
                        selectilall: false
                    });
                    this.setData({
                        num: 0,
                        fee: 0,
                        billNo: []
                    });
                }
            }
        },

        findInvoiceParkingList() {
            util.request(api.findInvoiceParkingList, '', 'GET')
                .then((res) => {
                    if (res.success) {
                        var _data = res.data;

                        for (var i = 0; i < _data.length; i++) {
                            _data[i].text = _data[i].parkingName;
                            _data[i].value = _data[i].parkingCode;
                        }

                        if (res.data && res.data.length == 0) {
                            uni.showToast({
                                title: '抱歉，数据查询为空！',
                                icon: 'none'
                            });
                            return;
                        }

                        this.setData({
                            option1: _data,
                            value1: res.data[0].parkingCode
                        });
                        const unionId = uni.getStorageSync('unionId') || '';
                        var param = {
                            userUnionId: unionId,
                            //e5ecc37c-dc0c-450a-ac96-e91c3349408b unionId
                            parkingCode: this.value1,
                            pageSize: '999',
                            pageNo: '1'
                        };
                        util.request(api.findAllowInvoiceBill, param, 'POST')
                            .then((res) => {
                                if (res.success) {
                                    this.setData({
                                        list: res.data.content
                                    });
                                } else {
                                    uni.showToast({
                                        title: res.msg || '提交失败',
                                        icon: 'none'
                                    });
                                }
                            })
                            .catch((err) => {
                                console.log(err);
                                uni.showToast({
                                    title: '接口出错了...',
                                    icon: 'none'
                                });
                            });
                    } else {
                        uni.showToast({
                            title: res.msg || '提交失败',
                            icon: 'none'
                        });
                    }
                })
                .catch((err) => {
                    console.log(err);
                    uni.showToast({
                        title: '接口出错了...',
                        icon: 'none'
                    });
                });
        }
    }
};
</script>
<style>
@import './index.css';
</style>
